<div class="widgets">
  <div class="row">
    <div class="col-md-12">
      <sa-card title="Ionicons-logo" baCardClass="with-scroll">
        <div class="row icons-list primary">
          <div class="col-sm-1" *ngFor="let icon of icons.ionicons.logo">
            <i class="{{ icon }}"></i>
          </div>
        </div>
        <a href="http://ionicons.com/" target="_blank" class="see-all-icons">See all ionicons icons</a>
      </sa-card>
    </div>
    <div class="col-md-6">
      <sa-card title="Ionicons-ios" baCardClass="with-scroll">
        <div class="row icons-list primary">
          <div class="col-sm-2" *ngFor="let icon of icons.ionicons.ios">
            <i class="{{ icon }}"></i>
          </div>
        </div>
        <a href="http://ionicons.com/" target="_blank" class="see-all-icons">See all ionicons icons</a>
      </sa-card>
    </div>
    <div class="col-md-6">
      <sa-card title="Ionicons-md" baCardClass="with-scroll">
        <div class="row icons-list primary">
          <div class="col-sm-2" *ngFor="let icon of icons.ionicons.md">
            <i class="{{ icon }}"></i>
          </div>
        </div>
        <a href="http://ionicons.com/" target="_blank" class="see-all-icons">See all ionicons icons</a>
      </sa-card>
    </div>
  </div>
</div>
